<div class="row">
    <div class="col-sm-12">
        <!-- 查询条件 -->
        <div class="box">
            <div class="box-header">
                <div class="box-title">
                    <button type="submit" class="btn btn-default" (click)="toggleModal('orderModal')">手动下单</button>
                    <button type="submit" class="btn btn-default" (click)="instructAlert()">确认到账</button>
                    <button type="submit" class="btn btn-default">更新数据</button>
                    <button type="submit" class="btn btn-default">导出数据文件</button>
                    <button type="submit" class="btn btn-default">打印本页</button>
                </div>
            </div>
            <!-- /.box-header -->
            <div class="box-body">
                <form class="form-inline">
                    <div class="form-group ext-from-item">
                        <label for="zhName">组合名称</label>
                        <input type="text" class="form-control" id="zhName" placeholder="组合名称">
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="listedDate">交易日期</label>
                        <div class="input-group">
                            <div class="input-group-addon">
                                <i class="fa fa-calendar"></i>
                            </div>
                            <input type="text" class="form-control pull-right" id="reservation">
                        </div>
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="listedDate">确认日期</label>
                        <div class="input-group">
                            <div class="input-group-addon">
                                <i class="fa fa-calendar"></i>
                            </div>
                            <input type="text" class="form-control pull-right" id="reservation">
                        </div>
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="securityId">证券代码</label>
                        <input type="text" class="form-control" id="securityId" placeholder="证券代码">
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="businessType">业务类型</label>
                        <select class="form-control">
                            <option selected="selected">业务类型</option>
                        </select>
                    </div>
                    <div class="form-group ext-from-item">
                        <label class="checkbox-inline control-label">
                            <input type="checkbox" id="inlineCheckbox1" value="option1">未提交申请表
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="inlineCheckbox2" value="option2">未提交确认单
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="inlineCheckbox3" value="option3">指令未确认
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="inlineCheckbox4" value="option4">未到账
                        </label>
                        <label class="checkbox-inline">
                            <input type="checkbox" id="inlineCheckbox4" value="option4">加急
                        </label>
                    </div>
                </form>
                <!-- 查询条件 END-->
                <!-- TAB -->
                <div class="nav-tabs-custom">
                    <ul class="nav nav-tabs">
                        <li class="active"><a href="#tab_1" data-toggle="tab">申购赎回</a></li>
                        <li><a href="#tab_2" data-toggle="tab">转换转托管</a></li>
                        <li><a href="#tab_3" data-toggle="tab">红利转投资</a></li>
                        <li class="pull-right"><a href="#" class="text-muted"><i class="fa fa-gear"></i></a></li>
                    </ul>
                    <div class="tab-content">
                        <div class="tab-pane active" id="tab_1">
                            <table class="table table-bordered">
                                <tr>
                                    <th>申请日期</th>
                                    <th>业务类型</th>
                                    <th>组合名称</th>
                                    <th>证券代码</th>
                                    <th>证券名称</th>
                                    <th>指令数量</th>
                                    <th>指令金额</th>
                                    <th>申请表</th>
                                    <th>确认单</th>
                                    <th>是否加急</th>
                                    <th>到账状态</th>
                                    <th>到帐日期</th>
                                    <th>确认日期</th>
                                    <th>恒生状态</th>
                                    <th>估值系统状态</th>
                                </tr>
                                <tr>
                                    <td>2017-3-2</td>
                                    <td>申购</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td>上传</td>
                                    <td>上传</td>
                                    <td>发起</td>
                                    <td>未到账</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>2017-3-2</td>
                                    <td>赎回</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td><a>上传/下载</a></td>
                                    <td><a>上传/下载</a></td>
                                    <td style="color:green;">加急</td>
                                    <td>未到账</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </table>
                        </div>
                        <!-- /.tab-pane -->
                        <div class="tab-pane" id="tab_2">
                            <table class="table table-bordered">
                                <tr>
                                    <th>申请日期</th>
                                    <th>业务类型</th>
                                    <th>组合名称</th>
                                    <th>证券代码</th>
                                    <th>证券名称</th>
                                    <th>指令数量</th>
                                    <th>指令金额</th>
                                    <th>申请表</th>
                                    <th>确认单</th>
                                    <th>是否加急</th>
                                    <th>到账状态</th>
                                    <th>到帐日期</th>
                                    <th>确认日期</th>
                                    <th>恒生状态</th>
                                    <th>估值系统状态</th>
                                </tr>
                                <tr>
                                    <td>2017-3-2</td>
                                    <td>转换</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td>上传</td>
                                    <td>上传</td>
                                    <td>发起</td>
                                    <td>未到账</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                                <tr>
                                    <td>2017-3-2</td>
                                    <td>转托管</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td><a>上传/下载</a></td>
                                    <td><a>上传/下载</a></td>
                                    <td style="color:green;">加急</td>
                                    <td>未到账</td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                </tr>
                            </table>
                        </div>
                        <!-- /.tab-pane -->
                        <div class="tab-pane" id="tab_3">
                        <table class="table table-bordered">
                                <tr>
                                    <th>基金名称</th>
                                    <th>证券代码</th>
                                    <th>证券名称</th>
                                    <th>分红结转方式</th>
                                    <th>红利结转日</th>
                                    <th>确认单</th>
                                    <th>到账状态</th>
                                </tr>
                                <tr>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td>上传</td>
                                    <td>未到账</td>
                                </tr>
                                <tr>
                                   <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                    <td>上传</td>
                                    <td>未到账</td>
                                </tr>
                            </table>
                        </div>
                        <!-- /.tab-pane -->
                    </div>
                    <!-- /.tab-content -->
                </div>
                <!-- TAB END -->
            </div>
            <!-- /.box-body -->
        </div>
    </div>
</div>

<!-- 手动下单 -->
<div class="modal fade" id="orderModal" tabindex="-1" role="dialog" aria-labelledby="手动下单">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="xjModalLabel">手动下单</h4>
            </div>
            <div class="modal-body">
                <form class="form-inline">
                    <div class="form-group ext-from-item">
                        <label for="zhName">组合名称</label>
                        <input type="text" class="form-control" id="zhName" placeholder="组合名称">
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="bondId">债券代码</label>
                        <input type="text" class="form-control" id="bondId" placeholder="债券代码">
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="amount">金额</label>
                        <input type="text" class="form-control" id="amount" placeholder="金额">
                    </div>
                    <div class="form-group ext-from-item">
                        <label for="businessType">业务类型</label>
                        <select class="form-control">
                            <option selected="selected">业务类型</option>
                        </select>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" (click)="submitXj">提交</button>
            </div>
        </div>
    </div>
</div>
<!-- 手动下单 END-->
